import { HeroListComponent } from './hero-list/hero-list.component';
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { HeroDetailComponent } from './hero-detail/hero-detail.component';

const heroesRoutes: Routes = [

  // 这两个路由是 地址已经临时变了，但是仍想要之前的地址能正常访问(不报错)，这就可以用重定向来解决
  { path: 'heroes' , redirectTo:'superheroes'},
  { path: 'hero/:id' , redirectTo:'superhero/:id'},

  // data对象用于转场，animation定义了转场的名字
  { path: 'superheroes',  component: HeroListComponent, data: { animation: 'heroes' } },
  { path: 'superhero/:id', component: HeroDetailComponent, data: { animation: 'hero' } }
];

@NgModule({
  // 在特定路由中，这些路由就不是给根组件用的，而是某个孩子组件
  imports: [RouterModule.forChild(heroesRoutes)],
  exports: [RouterModule]
})
export class HeroesRoutingModule { }
